<!DOCTYPE html>
<html lang="zh-cmn-Hans">

	<head>
		<meta charset="UTF-8">
		<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
		<meta content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" name="viewport">
		<script type="text/javascript" src="Plug/jquery-1.11.3.min.js"></script>
		<title>发布寄拍</title>
		<script src="Plug/layer-v3.1.1/layer.js" type="text/javascript" charset="utf-8"></script>
		<!--layer  弹框插件-->
		<link rel="stylesheet" href="static/css/base/reset.css" />
		<!--jqyery-weiui插件 -->
		<link rel="stylesheet" href="Plug/jquery-weui/jquery-weui.min.css">
		<link rel="stylesheet" href="Plug/jquery-weui/weui.min.css">
		<script src="Plug/jquery-weui/js/jquery-weui.js" type="text/javascript" charset="utf-8"></script>
		<script src="Plug/jquery-weui/js/city-picker.js" type="text/javascript" charset="utf-8"></script>
		<!--轮播插件-->
		<link rel="stylesheet" type="text/css" href="Plug/swiper/swiper.min.css" />
		<script src="Plug/swiper/swiper.min.js" type="text/javascript" charset="utf-8"></script>
		<!--重置样式-->
		<link rel="stylesheet" href="static/css/base/main.css" />
		<!--公共样式-->
		<link rel="stylesheet" type="text/css" href="http://at.alicdn.com/t/font_990287_96c88nyl5x7.css" />
		<!--阿里云图标库-->
		<script src="static/js/base.js" type="text/javascript" charset="utf-8"></script>
		<!---------------公共导入分割线------------------------>
		<!--本页样式-->
		<link rel="stylesheet" type="text/css" href="static/css/release/release.css" />
	</head>

	<body>
		<!--存在bar加此wrap-->
		<div class="have_bar_wrap">
			<div class="top_head flex_cb">
				<a class="back" href="javascript:void(0)"><i class="iconfont icon-xuanzeqishangyige"></i></a>
				<span>发布寄拍</span>
			</div>
			<div class="yp_list">
				<input class="yp_name" placeholder="标题名称" type="" name="" id="" value="" />
				<textarea class="yp_describe" placeholder="输入你的寄拍要求，尽可能详细" name="" rows="" cols=""></textarea>
			</div>
			<ul class="fill_data_list">
				<li>
					<i class="iconfont icon-fenlei"></i><span>类别</span>
					<input id="leibie" placeholder="请选择您的寄拍类别" type="" name="" id="" value="" />
					<i class="iconfont icon-xuanzeqixiayige"></i>
				</li>
				<li>
					<i class="iconfont icon-fenlei"></i><span>服务</span>
					<input id="xuqiu" placeholder="请选择您的寄拍服务" type="" name="" id="" value="" />
					<i class="iconfont icon-xuanzeqixiayige"></i>
				</li>
				<li>
					<i class="iconfont icon-fenlei"></i><span>收费模式</span>
					<input id="charging_model" placeholder="请选择收费模式" type="" name="" id="" value="" />
					<i class="iconfont icon-xuanzeqixiayige"></i>
				</li>
				<li class="pay_mode">
					<span id="payname">收费金额</span>
					<input id="payInput" placeholder="请输入收费金额" type="number" name="" id="" value="" />
					<b class="fill_data_list_dw">元/件</b>
					<i class="iconfont icon-xuanzeqixiayige"></i>
				</li>
				<li>
					<i class="iconfont icon-fenlei"></i><span>约拍认证会员</span>
					<input id="huiyuan" placeholder="是否认证会员" type="" name="" id="" value="" />
					<i class="iconfont icon-xuanzeqixiayige"></i>
				</li>
				<li>
					<i class="iconfont icon-fenlei"></i><span>信用担保</span>
					<input id="danbao" placeholder="请选择信用担保" type="" name="" id="" value="" />
					<i class="iconfont icon-xuanzeqixiayige"></i>
				</li>
			</ul>
			<div id="fuzhuang" class="choice_tip">
				<div class="choice_tip_tit flex_cl">
					<i class="iconfont icon-fenlei fengge_icon"></i>
					<span>风格（多选）</span>
				</div>
				<div class="choice_tiplist">
					<a class="choice_tip_action" href="javascript:void(0)">欧美</a>
					<a href="javascript:void(0)">日系</a>
					<a href="javascript:void(0)">港风</a>
					<a href="javascript:void(0)">街拍</a>
					<a href="javascript:void(0)">名媛</a>
					<a href="javascript:void(0)">网红</a>
					<a href="javascript:void(0)">小清新</a>
					<a href="javascript:void(0)">胶片</a>
				</div>
			</div>
			<div style="padding-top: 0;" class="yp_list add_photo">
				<div class="choice_tip_tit flex_cl">
					<i class="iconfont icon-fenlei fengge_icon"></i>
					<span>风格参考</span>
				</div>
				<a class="add_btn_yp flex_cc" href="javascript:void(0)">
					<i class="iconfont icon-tupian"></i>
					<p>添加照片</p>
				</a>
				<img src="static/images/changkuan21.png" />
				<img src="static/images/changkuan21.png" />
				<img src="static/images/changkuan21.png" />
				<img src="static/images/changkuan21.png" />
			</div>
			<a class="next_fill flex_cc" href="javascript:void(0)">立即发布</a>
		</div>
	</body>
	<script type="text/javascript">
		$(function() {
			$("#leibie").picker({
				title: "请选择寄拍类别",
				cols: [{
					textAlign: 'center',
					values: ['找模特', '找商家']
				}],
				onClose: function(d) {
					val = (this, d.displayValue);
					alert(JSON.stringify(val))
				}
			});
			$("#xuqiu").picker({
				title: "请选择您的服务",
				cols: [{
					textAlign: 'center',
					values: ['拍服装', '拍产品','其他']
				}],
				onClose: function(d) {
					val = (this, d.displayValue);
					alert(JSON.stringify(val));
					if(val == "拍服装") {
						$("#fuzhuang").slideDown(300);
					} else {
						$("#fuzhuang").slideUp(300);
					}
				}
			});
			$("#huiyuan").picker({
				title: "请选择是否会员",
				cols: [{
					textAlign: 'center',
					values: ['是', '不限']
				}],
				onClose: function(d) {
					val = (this, d.displayValue);
					alert(JSON.stringify(val))
				}
			});
			$("#danbao").picker({
				title: "请选择是否担保",
				cols: [{
					textAlign: 'center',
					values: ['是', '不限']
				}],
				onClose: function(d) {
					val = (this, d.displayValue);
					alert(JSON.stringify(val))
				}
			});
			$("#charging_model").picker({
				title: "请选择您的收费模式",
				cols: [{
					textAlign: 'center',
					values: ['希望互免', '需要收费', '愿意付费', '费用协商']
				}],
				onClose: function(d) {
					val = (this, d.displayValue);
					alert(JSON.stringify(val))
					if(val == "需要收费") {
						$(".pay_mode").css("display", "flex")
						$("#payname").text("收费金额");
						$("#payInput").attr("placeholder", "请输入收费金额");
					} else if(val == "愿意付费") {
						$(".pay_mode").css("display", "flex");
						$("#payname").text("付费金额");
						$("#payInput").attr("placeholder", "请输入付费金额");
					} else {
						$(".pay_mode").css("display", "none")
					}
				}
			});
			$(document).on("click", ".add_photo img", function() {
				$(this).remove();
			})
			$(document).on("click", ".choice_tiplist a", function() {
				if($(this).hasClass("choice_tip_action")) {
					$(this).removeClass("choice_tip_action");
				} else {
					$(this).addClass("choice_tip_action");
					var tipnum = $(this).parent().find(".choice_tip_action").length;
					if(tipnum > 5) {
						Msg("最多只能选择5个");
						$(this).removeClass("choice_tip_action");
						return false;
					}
				}
			})
		})
	</script>

</html>